import React from "react";
import { ResultPage, Card } from "antd-mobile";
import style from "./index.module.css";
import { LoopOutline } from "antd-mobile-icons";
import { Button, Space } from "antd-mobile";
import { upzhizhu } from '../store/slice/ticketslice'
import { useSelector } from "react-redux";
import { useDispatch } from "react-redux";
import { useNavigate } from "react-router-dom";
import { Popup } from "antd-mobile";
import { useState } from "react";
import { CalendarPickerView } from "antd-mobile";
function Index() {
    const dispatch = useDispatch() 
    let nav=useNavigate()
    const strta = useSelector((store) => store.tickets.strta);
    const ent = useSelector((store) => store.tickets.ent);
    const dayjs = useSelector((store) => store.tickets.dayjs);
      const [visible5, setVisible5] = useState(false);
  return (
    <div>
      <ResultPage
        status="success"
        title="国内火车"
        description="内容详情可折行，建议不超过两行建议不超过两行建议不超过两行"
      >
        <ResultPage.Card style={{ padding: 8 }}>
          <div className={style.box}>
            <span className={style.z1} onClick={() => nav("/crty?type=strta")}>
              {strta}
            </span>
            <LoopOutline fontSize={26} />
            <span className={style.z2} onClick={() => nav("/crty?type=ent")}>
              {ent}
            </span>
          </div>
          <div className={style.box}>
            <div>
              <span className={style.z3} onClick={() => setVisible5(true)}>
                {dayjs}
              </span>
              <span className={style.z4}>明天</span>
              <Popup
                visible={visible5}
                onMaskClick={() => {
                  setVisible5(false);
                }}
                bodyStyle={{
                  borderTopLeftRadius: "8px",
                  borderTopRightRadius: "8px",
                  minHeight: "40vh",
                }}
              >
                {<CalendarPickerView />}
              </Popup>
            </div>
          </div>
          <div className={style.box}>
            <Button block color="primary" size="large">
              查询
            </Button>
          </div>
          <div className={style.box}>
            <span className={style.z5}>北京-厦门10.22 </span>
          </div>
        </ResultPage.Card>
      </ResultPage>
    </div>
  );
}

export default Index;
